<template>
	<view class="columnbox content wdh-100" v-if="doctor!=''">
		<image src="/static/img/wenzhenpay.png" mode="aspectFill" class="top-img"></image>
		<view class="info-box columnbox">
			<view class="info-title">医生本人服务·未接诊可退</view>
			<view class="rowbox d-box als">
				<image :src="doctor.logo" mode="aspectFill" class="d-img"></image>
				<view class="columnbox als" style="margin-left: 20rpx;">
					<view class="rowbox d-name">{{doctor.name}} <text>{{doctor.zhicheng}} | {{doctor.keshi}}</text>
					</view>
					<view class="d-jigou">{{doctor.jigou}}</view>
				</view>
			</view>
			<view class="columnbox d-box">
				<view class="u-title">图文就诊详情</view>
				<view class="rowbox wdh-100 spb" style="margin-top: 20rpx;">
					<view class="w-title">问诊价格</view>
					<view class="w-title price-num">{{doctor.fwprice}}元</view>
				</view>
				<view class="rowbox wdh-100 spb" style="margin-top: 20rpx;">
					<view class="w-title">服务时长</view>
					<view class="w-title" style="color: #2d2d2d ;">图文多轮沟通</view>
				</view>
				<view class="rowbox wdh-100 spb" style="margin-top: 20rpx;">
					<view class="w-title">就诊患者</view>
					<view class="w-title" style="color: #2d2d2d ;">{{userinfo.name}}</view>
				</view>
			</view>
		</view>
		<view class="wdh-100" style="height: 200rpx;"></view>
		<view class="rowbox bottom-box wdh-100">
			<view class="send-btn wdh-100 rowbox" @click="toPay">下一步</view>
		</view>
		<view class="wdh-100" style="height: 200rpx;"></view>
		<view class="rowbox bottom-box spb wdh-100">
			<view class="price-num" style="font-size: 32rpx;font-weight: bold;">实付 {{doctor.fwprice}}元</view>
			<view class="send-btn rowbox" style="width: 320rpx;" @click="toPay">确认支付</view>
		</view>
	</view>
</template>

<script>
	// 环信即时通讯
	import SDK from 'js_sdk/easemob-im-uni-app/Easemob-chat';
	// 实例化 SDK 对象
	const WebIM = wx.WebIM = SDK;
	import getDate from '@/utils/time.js'
	export default {
		data() {
			return {
				id: 0,
				doctor: '',
				userinfo: '',
				submitflag: false,
				connectcount: 0
			};
		},
		onLoad(options) {
			this.id = options.id * 1
			this.getDetail()
			this.getUser()
		},
		methods: {
			getUser() {
				this.$req.post('/user/userinfo', {
					memberid: uni.getStorageSync('memberid')
				}).then(res => {
					this.userinfo = res.data.data
				})
			},
			toPay() {
				if (!this.submitflag) {
					this.submitflag = true
					uni.showLoading({
						title: ''
					})
					if (this.doctor.fwprice == 0) {
						this.$req.post('/user/wechatwzpay', {
							uid: uni.getStorageSync('uid'),
							doctorid: this.id
						}).then(res => {
							// this.$req.post('/user/patientadd', {
							// 	id: this.id,
							// 	uid: uni.getStorageSync('uid')
							// }).then(res => {
							// 	this.submitflag = false
							// 	uni.hideLoading()
							// })
							this.submitflag = false
							uni.hideLoading()
							this.sendMessage()
						})
					} else {
						this.$req.post('/user/wechatwzpay', {
							uid: uni.getStorageSync('uid'),
							doctorid: this.id
						}).then(res => {
							if (res.data.code == 0) {
								var info = JSON.parse(res.data.data)
								delete info.appId
								uni.requestPayment({
									provider: 'wxpay',
									...info,
									success: res => {
										console.log('=success===', res)
										uni.showToast({
											title: '支付成功'
										})
										this.$req.post('/user/patientadd', {
											id: this.id,
											uid: uni.getStorageSync('uid')
										}).then(res => {})
										this.sendMessage()
									},
									fail: function(err) {
										console.log('fail:' + JSON.stringify(err));
									},
									complete(res) {
										console.log('=res===', res)
										this.submitflag = false
										uni.hideLoading()
									}
								});
							} else {
								uni.hideLoading()
								this.submitflag = false
								uni.showModal({
									title: '支付失败',
									content: res.data.msg
								})
							}

							// 支付成功
							// this.submitflag = false
							// uni.request({
							// 	url: `https://zhongyi.weizi000.cn/user/wenzhenpaycs?orderid=${res.data.order.id}`,
							// 	method: 'GET',
							// 	success: (res) => {
							// 		uni.showToast({
							// 			title: '支付成功'
							// 		})
							// 		this.$req.post('/user/patientadd', {
							// 			id: this.id,
							// 			uid: uni.getStorageSync('uid')
							// 		}).then(res => {})
							// 		this.sendMessage()
							// 	}
							// })
						})
					}

				}
			},
			sendMessage() {
				let content = {
					classify: 14,
					content: '开始问诊',
					otherid: 0,
					name: this.doctor.name,
					chatroomheadpic: this.doctor.logo
				}
				let option = {
					type: "txt",
					msg: JSON.stringify(content),
					to: this.doctor.memberid + '',
					chatType: "singleChat",
				};
				let msg = WebIM.message.create(option);
				getApp().globalData.conn.send(msg).then((res) => {
					console.log("=========Send message success", res);
					this.$store.dispatch('actionsHandleNewChatChange', {
						msg: JSON.stringify(content),
						from: this.doctor.memberid + '',
						time: Date.parse(new Date),
					});
					setTimeout(() => {
						uni.hideLoading()
						// uni.redirectTo({
						// 	url: '/pages/chat/detail?id=' + this.doctor.memberid
						// })
						uni.redirectTo({
							url: '/pages/chat/describe?id=' + this.doctor.memberid
						})
					}, 1000)
				}).catch((e) => {
					console.log("==============Send message fail", e);
				});
				// getApp().globalData.chatSocket.send({
				// 	data: JSON.stringify({
				// 		"receiveid": this.doctor.memberid,
				// 		"content": '开始问诊',
				// 		"classify": 14,
				// 		"nickname": this.userinfo.name,
				// 		"logo": this.userinfo.logo
				// 	}),
				// 	success: res => {
				// 		uni.redirectTo({
				// 			url: '/pages/chat/detail?id=' + this.doctor.memberid
				// 		})
				// 		// setTimeout(() => {
				// 		//     getApp().globalData.chatDetailNew = {
				// 		//         friendsid: this.doctor.memberid,
				// 		//         classify: 14,
				// 		//         logo: this.doctor.logo,
				// 		//         content: '开始问诊',
				// 		//         last_id: '',
				// 		//         name: this.doctor.name,
				// 		//         unread_cnt: 1,
				// 		//         addtime: Date.parse(new Date()) / 1000,
				// 		//         userid: this.id,
				// 		//     }
				// 		//     uni.redirectTo({
				// 		//         url: '/pages/chat/detail?id=' + this.doctor.memberid
				// 		//     })
				// 		// }, 500);
				// 	},
				// 	fail: (err) => {
				// 		console.log('发送失败', err)
				// 		this.reConnect()
				// 	}
				// });
			},
			reConnect() {
				setTimeout(() => {
					if (this.connectcount < 10) {
						this.connectcount++
						this.sendMessage()
					} else {
						this.connectcount = 0
						uni.showToast({
							title: '发送消息失败',
							icon: 'none'
						})
					}
				}, 500)
			},
			getDetail() {
				let data = {
					id: this.id
				}
				if (uni.getStorageSync('uid')) {
					data.uid = uni.getStorageSync('uid')
				}
				this.$req.post('/user/doctorinfo', data).then(res => {
					this.doctor = res.data.data.doctor
					// this.doctorsljb = res.data.data.doctorsljb
					// this.ifgz = res.data.data.ifgz
					// res.data.data.pinlun.forEach(resp => {
					//     resp.addtime = getdate.couponDate(resp.addtime)
					// })
					// this.pinlun = res.data.data.pinlun
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		font-family: PingFang SC;
		background: #F5F8FB;
		min-height: 100vh;
		justify-content: flex-start;
	}

	.top-img {
		width: 100%;
		height: 400rpx;
	}

	.info-box {
		width: 100%;
		// background: linear-gradient(to bottom, #a3deb2, #F5F8FB);
		background: #F5F8FB;
		border-radius: 20rpx;
		padding: 32rpx 32rpx;
		border-radius: 20rpx;
		margin-top: -20rpx;
		z-index: 2;
	}

	.info-title {
		font-size: 28rpx;
		width: 100%;
		color: #1c5f2d;
	}

	.d-box {
		width: 100%;
		margin-top: 20rpx;
		background: #fff;
		border-radius: 20rpx;
		padding: 32rpx 32rpx;
		justify-content: flex-start;
	}

	.d-img {
		border-radius: 100rpx;
		width: 100rpx;
		height: 100rpx;
	}

	.d-name {
		font-size: 32rpx;

		text {
			font-size: 28rpx;
			margin-left: 20rpx;
			color: #707070;
		}
	}

	.d-jigou {
		font-size: 28rpx;
		color: #707070;
		margin-top: 10rpx;
		width: 500rpx;
	}

	.u-title {
		font-size: 32rpx;
		width: 100%;
	}

	.add-box {
		width: 100%;
		background: #f9fafc;
		border-radius: 20rpx;
		margin-top: 20rpx;
		font-size: 28rpx;
		padding: 32rpx 32rpx;
	}

	.u-box {
		width: 100%;
		border-radius: 20rpx;
		margin-top: 20rpx;
		padding: 20rpx 20rpx;
		background: rgba(#a3deb2, 0.1);
		border: #a3deb2 solid 1px;
		justify-content: flex-start;
	}

	.u-img {
		width: 100rpx;
		height: 100rpx;
		border-radius: 100rpx;
	}

	.u-name {
		font-size: 32rpx;
	}

	.u-desc {
		font-size: 28rpx;
		margin-top: 10rpx;
		color: #707070;

		view {
			margin-right: 20rpx;
		}
	}

	.w-title {
		font-size: 28rpx;
		color: #6b6c6c;
	}

	.price-num {
		color: #fc2c0c;
	}
</style>